<template>
    <el-dialog :close-on-click-modal="false" :visible="detailFlag" class="zdy-dialog" width="700px" :title="$t('view')" :lock-scroll="false" :before-close="handleCloseDialog">

        <el-form :disabled="true" v-if="editTableRow.personnelInfo" label-width="120px" v-model="editTableRow">

            <el-row :gutter="20" style="font-size: 16px">



                <el-col :span="12">
                  <!--姓名-->
                  <el-form-item :label="$t('name')">
                    <el-input v-model="editTableRow.personnelInfo.name"></el-input>
                  </el-form-item>
                </el-col>

                <el-col :span="12">
                  <!--编号（工号）-->
                  <el-form-item :label="$t('Number (job number)')">
                    <el-input v-model="editTableRow.personnelInfo.jobNumber===''?'-':editTableRow.personnelInfo.jobNumber"></el-input>
                  </el-form-item>
                </el-col>

                <el-col :span="12">
                  <!--通行设备-->
                  <el-form-item :label="$t('Access equipment')">
                    <el-input v-model="editTableRow.deviceInfo.deviceName"></el-input>
                  </el-form-item>
                </el-col>
              <el-col :span="12">
                <!--识别方式-->
                <el-form-item :label="$t('Identification method')">
                  <el-input v-model="editTableRow.passBy"></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <!--通行状态-->
                <el-form-item :label="$t('Traffic status')">
                  <el-input v-model="editTableRow.success"></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <!--通行时间-->
                <el-form-item :label="$t('Transit time')">
                  <el-input v-model="editTableRow.passDateTime"></el-input>
                </el-form-item>
              </el-col>

            </el-row>
        </el-form>
    </el-dialog>
</template>

<script>
    export default {
        name: "views",
        props: {
            editTableRow: {
                type: Object,
                defautl: () => {
                    return {}
                }
            },
            detailFlag: {
                type: Boolean,
                default: false
            }
        },
        data(){
            return{
                value: 0,
                saveDisabled:false,
                form:{
                    sbmc:''
                }
            }
        },
        mounted(){
            if(!this.editTableRow.personnelInfo){
                this.editTableRow.personnelInfo={
                    name:'-',
                    idCard:'-'
                }
            }
            if(!this.editTableRow.deviceInfo){
                this.editTableRow.deviceInfo={
                    deviceName:'-'
                }
            }
        },
        methods:{
            /**
             * @description  关闭弹窗事件
             * @return not
             * @author xiongyi 2022-06-29 16:48:08
             **/
            handleCloseDialog() {
                this.$emit('update:detailFlag', false);
                this.$emit('update:editTableRow', {});
                this.$emit('update:editTableRow', null);
            }
        }
    }
</script>

<style scoped>

    /*.itemLabel{*/
    /*    color: #8c94a4;*/
    /*    display: inline-block;*/
    /*    width: 180px;*/
    /*    text-align: right;*/
    /*    margin-right: 10px;*/
    /*    line-height: 32px;*/
    /*}*/

    /*::v-deep .el-descriptions-item__content {*/
    /*    max-width: 295px;*/
    /*}*/

    /*.my-label {*/
    /*    width: 200px;*/
    /*    color: #999;*/
    /*    font-weight: normal;*/
    /*    background: #fff;*/
    /*}*/
    /*.my-class {*/
    /*    max-width: 295px;*/
    /*    word-break: break-all;*/
    /*    word-wrap: break-word;*/
    /*}*/
</style>
